<script lang="jsx">
  export default {
    name: 'CrudTableColumn',
    functional: true,
    props: {
      columns: {
        type: Array,
        default: () => []
      }
    },
    render(_, { props, scopedSlots }) {
      const { columns } = props
      if(!columns) return null

      return columns.map( col => {
        const { children, ...props} = col
        return (
          <el-table-column align="center" {...{props, scopedSlots}} key={ col.prop }>
          { children && <crud-table-column columns={children} scopedSlots={scopedSlots} /> }
          </el-table-column>
        )
      })
    }
  }
</script>
